<template>
    <transition>
        <div class="body main_page" @mousewheel="scrollFunc(false)">
            <!--<img class="bgimg" src='@/assets/img/raw_1536733888.png'/>-->
            <div class="dapp-title">
                <span class="mui-icon mui-icon-back" @click="changeRoute('/index/dapp')"></span>
                <span>{{$t('m.efomo.title')[0]}}</span>
                <span></span>
            </div>
            <div class="content wrapper">
                <div class="efomo-sign-box">
                    <!--头部内容-->
                    <div class="efomo-sign-tit">
                        <span>{{$t('m.efomo.register.tit')}}</span>
                    </div>
                    <!--内容主题-->
                    <div class="efomo-sign-content">
                        <div class="efomo-sign-input">
                            <input type="text" :placeholder="$t('m.efomo.placeholder')[0]" v-model="laffCode">
                            <div class="efomo-sign-icon" @click="changeRoute('/dapp/efomo/fomoScan')">
                                <img src="@/assets/img/saomiao.png" alt="" class="saomaimg">
                            </div>
                        </div>
                        <div class="efomo-sign-check">
                            <label for="checkThis">
                                <input id="checkThis" v-model="isCheck" type="checkbox">
                                <span class="needsclick">
                                    {{$t('m.efomo.register.protocol')[0]}}
                                    <a @click="aShowTip({id:'5',explainShow:true})">
                                        {{$t('m.efomo.register.protocol')[1]}}
                                    </a>
                                    {{$t('m.efomo.register.protocol')[2]}}
                                </span>
                            </label>
                        </div>
                        <div class="efomo-sign-tip">
                            <p>{{$t('m.efomo.register.content')[1]}}</p>
                        </div>
                        <button class="efomo-sign-btn" @click="register()">
                            {{$t('m.efomo.btn.register')}}
                        </button>
                    </div>
                    <!--底部内容-->
                    <div class="efomo-sign-foot">
                        <h5>{{$t('m.efomo.register.tip')}}</h5>
                        <p>{{$t('m.efomo.register.content')[0]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[2]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[3]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[4]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[5]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[6]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[7]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[8]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[9]}}
                            <span class="create-line"></span>
                            {{$t('m.efomo.register.content')[10]}}
                        </p>
                    </div>
                </div>
            </div>
            <Efomo_tip></Efomo_tip>
        </div>
    </transition>
</template>

<script>
    import '@/assets/css/efomo.scss'
    import {myAlert} from "@/assets/js/h5plus/nativeUI";
    import {pIDxName_} from "@/assets/js/etherjs/fomo/playerbook"
    import {formatBytes32String} from "@/assets/js/etherjs/until"

    import BScroll from 'better-scroll'

    export default {
        name: "efomo_register",
        data() {
            return {
                isCheck: true,
                laffCode: ""
            }
        },
        mounted() {
            this.laffCode = this.$route.query.address
            setTimeout(() => {
                this.setScroll();
            }, 200);
        },
        methods: {
            setScroll() { //页面滚动以及上拉加载、下拉刷新
                new BScroll('.wrapper', {
                    scrollY: true,
                    click: true,
                    pullDownRefresh: {
                        threshold: 20, // 下拉距离超过30px触发pullingDown事件
                        stop: 0 // 回弹停留在距离顶部20px的位置
                    },
                    pullUpLoad: {
                        threshold: -10
                    }
                });
            },
            /*
             * 注册
             */
            async register() {
                if (this.laffCode == "") {
                    myAlert({
                        msg: this.$t('m.efomo.toast[17]'),
                    });
                    return;
                }
                // 0.isCheck
                if (!this.isCheck) {
                    myAlert({
                        msg: this.$t('m.efomo.toast[18]'),
                    });
                    return;
                }

                // 1.判断推荐人是否存在
                let res = await pIDxName_(formatBytes32String(this.laffCode));
                if (res == 0) {
                    myAlert({
                        msg: this.$t('m.efomo.toast[19]'),
                    });
                    return;
                }
                // 2.保存到本地数据库
                localStorage.setItem("fomo_laff_" + this.walletActive.address, formatBytes32String(this.laffCode));
                // 3.跳转路由
                this.changeRoute('/dapp/efomo/biling')
            }
        }
    }
</script>

<style scoped>
    .create-line {
        margin: .1rem;
        display: block;
    }
</style>